import { useContext } from 'react';
import { NavLink } from 'react-router-dom';
import './index.sass';
import MenuContext from '@/context/MenuContext';

const Aside = () => {
  const { menu } = useContext(MenuContext);
  const menuList = menu.filter((i: AnyObject) => i.postion === 'left');

  return (
    <aside>
      <ul>
        {menuList.map((item: AnyObject) => (
          <li key={item.id}>
            <NavLink to={item.url.slice(1)}>
              <span className={'iconfont ' + item.ico} />
              <p>{item.name.substring(0, 2)}</p>
            </NavLink>
          </li>
        ))}
      </ul>
    </aside>
  );
};

export default Aside;
